<template>
  <view class="normal-login-container">

    <view class="item-wrap" style="margin-bottom: 0">
      <view class="lineBottom10">
        <uni-section title="维修信息" type="line"/>
      </view>

      <view style="margin: 8rpx 20rpx 8rpx 20rpx">
        <uni-forms ref="ruleForm" :rules="rules" :label-position="boole ? 'top' : 'left'" :model="ruleForm"
                   labelWidth="auto">
          <uni-forms-item label="维修类别:" name="maintenanceType" :required="boole">
            <text class="maintenanceType"/>
            <uni-data-checkbox v-if="boole" v-model="ruleForm.maintenanceType"
                               :disabled="ruleForm.businessDataId && ruleForm.businessDataId !== 'null'"
                               :localdata="maintenance"/>
            <text v-else> {{ handleValue(ruleForm.maintenanceType) }}</text>
          </uni-forms-item>

          <uni-forms-item label="理赔类别:" name="settlementType" :required="boole"
                          v-if="ruleForm.maintenanceType === '3'">
            <text class="settlementType"/>
            <uni-data-checkbox v-if="boole" v-model="ruleForm.settlementType" :localdata="settlement"/>
            <text v-else> {{ ruleForm.settlementType === '1' ? '实物赔付申请' : ruleForm.settlementType === '2' ? '理赔款支付申请' : '-' }}</text>
          </uni-forms-item>

          <view v-if="ruleForm.maintenanceType !== '3'">

            <uni-forms-item label="预计维修开始时间:" name="expectStartTime" :required="boole">
              <text class="expectStartTime"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择预计维修开始时间"
                                   return-type="string" v-model="ruleForm.expectStartTime"/>
              <text v-else> {{ ruleForm.expectStartTime || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="预计维修结束时间:" name="expectEndTime" :required="boole">
              <text class="expectEndTime"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择预计维修结束时间"
                                   :start="handleEffectDate(ruleForm.expectStartTime)"
                                   return-type="string" v-model="ruleForm.expectEndTime"/>
              <text v-else> {{ ruleForm.expectEndTime || '-' }}</text>
            </uni-forms-item>

          </view>

          <!-- 保险类型 报废 -->
          <view v-if="ruleForm.maintenanceType === '1'">

            <uni-forms-item label="被保险人:" name="insuredName" :required="boole">
              <text class="insuredName"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.insuredName" placeholder="请输入被保险人"/>
              <text v-else> {{ ruleForm.insuredName || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="驾驶员:" name="driverName" :required="boole">
              <text class="driverName"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.driverName" placeholder="请输入驾驶员"/>
              <text v-else> {{ ruleForm.driverName || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="责任人单位名称:" name="responsibleUnitName" :required="boole">
              <text class="responsibleUnitName"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.responsibleUnitName" placeholder="请输入责任人单位名称"/>
              <text v-else> {{ ruleForm.responsibleUnitName || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="责任类型:" name="responsibilityType" :required="boole">
              <text class="responsibilityType"/>
              <zxz-uni-data-select v-if="boole" v-model="ruleForm.responsibilityType" :localdata="dict.type.responsibility_type"
                               dataKey="label" dataValue="value"
                               placeholder="请选择责任类型"
                               :clear="true" filterable/>
              <text v-else> {{ handleLabel(dict.type.responsibility_type, ruleForm.responsibilityType) }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="责任方保险公司名称:" name="responsibleInsuranceUnitName" :required="boole">
              <text class="responsibleInsuranceUnitName"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.responsibleInsuranceUnitName" placeholder="请输入责任方保险公司名称"/>
              <text v-else> {{ ruleForm.responsibleInsuranceUnitName || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="事故日期:" name="accidentDate" :required="boole">
              <text class="accidentDate"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择事故日期"
                                   return-type="string" v-model="ruleForm.accidentDate"/>
              <text v-else> {{ ruleForm.accidentDate || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="事故类型:" name="accidentType" :required="boole">
              <text class="accidentType"/>
              <zxz-uni-data-select v-if="boole" v-model="ruleForm.accidentType" :localdata="dict.type.accident_type"
                               dataKey="label" dataValue="value"
                               placeholder="请选择事故类型"
                               :clear="true" filterable/>
              <text v-else> {{ handleLabel(dict.type.accident_type, ruleForm.accidentType) }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="出险地点:" name="accidentLocation" :required="boole">
              <text class="accidentLocation"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.accidentLocation" placeholder="请输入出险地点"/>
              <text v-else> {{ ruleForm.accidentLocation || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="是否有人伤:" name="humanInjury" :required="boole">
              <text class="humanInjury"/>
              <uni-data-select v-if="boole" v-model="ruleForm.humanInjury" :localdata="range"
                               placeholder="请选择是否有人伤"
                               :clear="true" filterable/>
              <text v-else> {{
                  ruleForm.humanInjury == '1' ? '是' : ruleForm.humanInjury == '2' ? '否' : ''
                }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="报案时间:" name="reportingCaseTime" :required="boole">
              <text class="reportingCaseTime"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择报案时间"
                                   return-type="string" v-model="ruleForm.reportingCaseTime"/>
              <text v-else> {{ ruleForm.reportingCaseTime || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="定损单:" name="lossAssessmentUrl" :required="boole">
              <text class="lossAssessmentUrl"/>
              <image-common :disabled="!boole" :up-type="2" v-model="ruleForm.lossAssessmentUrl"/>
            </uni-forms-item>

          </view>

          <!-- 维修类型 一般维修 -->
          <view v-if="ruleForm.maintenanceType === '2'">

            <uni-forms-item label="签约维修厂/维修厂:" name="maintenanceShopId" :required="boole">
              <text class="maintenanceShopId"/>
              <zxz-uni-data-select v-if="boole" v-model="ruleForm.maintenanceShopId" :localdata="options"
                                   dataKey="supplierName" dataValue="supplierId"
                                   placeholder="签约维修厂/维修厂"
                                   @change="handleMaintenanceShopId"
                                   :clear="true" filterable/>
              <text v-else>{{ ruleForm.maintenanceShop || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="故障现象:" name="faultPhenomenon" :required="boole">
              <text class="faultPhenomenon"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.faultPhenomenon" placeholder="请输入故障现象"/>
              <text v-else> {{ ruleForm.faultPhenomenon || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="维修厂故障诊断:" name="maintenanceFaultDiagnosis" :required="boole">
              <text class="maintenanceFaultDiagnosis"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.maintenanceFaultDiagnosis" placeholder="请输入维修厂故障诊断"/>
              <text v-else> {{ ruleForm.maintenanceFaultDiagnosis || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="维修厂报价:" name="maintenanceQuoter" :required="boole">
              <text class="maintenanceQuoter"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.maintenanceQuoter" @blur="blurAmount('maintenanceQuoter')"
                             disabled
                             placeholder="请输入维修厂报价"/>
              <text v-else> {{ ruleForm.maintenanceQuoter || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="是否符合索赔理由:" name="reasonForClaim" :required="boole">
              <text class="reasonForClaim"/>
              <uni-data-select v-if="boole" v-model="ruleForm.reasonForClaim" :localdata="range"
                               placeholder="请选择是否符合索赔理由"
                               :clear="true" filterable/>
              <text v-else> {{
                  ruleForm.reasonForClaim == '1' ? '是' : ruleForm.reasonForClaim == '2' ? '否' : ''
                }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="不符合索赔理由:" v-if="ruleForm.reasonForClaim == '2'">
              <uni-easyinput v-if="boole" v-model="ruleForm.claimantReason"
                             placeholder="输入不符合索赔理由"/>
              <text v-else> {{ ruleForm.claimantReason || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="是否有同车型(处置车辆)对换配件:">
              <uni-data-select v-if="boole" v-model="ruleForm.swappingAccessories" :localdata="range"
                               placeholder="请选择是否有同车型(处置车辆)对换配件"
                               :clear="true" filterable/>
              <text v-else> {{
                  ruleForm.swappingAccessories == '1' ? '是' : ruleForm.swappingAccessories == '2' ? '否' : ''
                }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="综合建议方案:" name="comprehensiveRecommendations" :required="boole">
              <text class="comprehensiveRecommendations"/>
              <uni-easyinput type="textarea" v-if="boole" :maxlength="490" v-model="ruleForm.comprehensiveRecommendations"
                             placeholder="请输入综合建议方案"/>
              <text v-else>{{ ruleForm.comprehensiveRecommendations || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="备注:">
              <uni-easyinput type="textarea" v-if="boole" :maxlength="490" v-model="ruleForm.generalMaintenanceRemark"
                             placeholder="请输入备注"/>
              <text v-else>{{ ruleForm.generalMaintenanceRemark || '-' }}</text>
            </uni-forms-item>


          </view>

          <!-- 保险类型 出险 -->
          <view v-if="ruleForm.maintenanceType === '3'">

            <uni-forms-item label="被保险人:" name="insuredName" :required="boole">
              <text class="insuredName"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.insuredName" placeholder="请输入被保险人"/>
              <text v-else> {{ ruleForm.insuredName || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="驾驶员:" name="driverName" :required="boole">
              <text class="driverName"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.driverName" placeholder="请输入驾驶员"/>
              <text v-else> {{ ruleForm.driverName || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="责任类型:" name="responsibilityType" :required="boole">
              <text class="responsibilityType"/>
              <zxz-uni-data-select v-if="boole" v-model="ruleForm.responsibilityType" :localdata="dict.type.responsibility_type"
                               dataKey="label" dataValue="value"
                               placeholder="请选择责任类型"
                               :clear="true" filterable/>
              <text v-else> {{ handleLabel(dict.type.responsibility_type, ruleForm.responsibilityType) }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="责任人单位名称:" name="responsibleUnitName" :required="boole">
              <text class="responsibleUnitName"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.responsibleUnitName" placeholder="请输入责任人单位名称"/>
              <text v-else> {{ ruleForm.responsibleUnitName || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="事故类型:" name="accidentType" :required="boole">
              <text class="accidentType"/>
              <zxz-uni-data-select v-if="boole" v-model="ruleForm.accidentType" :localdata="dict.type.accident_type"
                               dataKey="label" dataValue="value"
                               placeholder="请选择事故类型"
                               :clear="true" filterable/>
              <text v-else> {{ handleLabel(dict.type.accident_type, ruleForm.accidentType) }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="出险地点:" name="accidentLocation" :required="boole">
              <text class="accidentLocation"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.accidentLocation" placeholder="请输入出险地点"/>
              <text v-else> {{ ruleForm.accidentLocation || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="是否有人伤:" name="humanInjury" :required="boole">
              <text class="humanInjury"/>
              <uni-data-select v-if="boole" v-model="ruleForm.humanInjury" :localdata="range"
                               placeholder="请选择是否有人伤"
                               :clear="true" filterable/>
              <text v-else> {{
                  ruleForm.humanInjury == '1' ? '是' : ruleForm.humanInjury == '2' ? '否' : ''
                }}
              </text>
            </uni-forms-item>

            <uni-forms-item label="出险日期:" name="accidentTime" :required="boole">
              <text class="accidentTime"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择出险日期"
                                   return-type="string" v-model="ruleForm.accidentTime"/>
              <text v-else> {{ ruleForm.accidentTime || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="报案时间:" name="reportingCaseTime" :required="boole">
              <text class="reportingCaseTime"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择报案时间"
                                   return-type="string" v-model="ruleForm.reportingCaseTime"/>
              <text v-else> {{ ruleForm.reportingCaseTime || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="预计维修开始时间:" name="expectStartTime" :required="boole">
              <text class="expectStartTime"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择预计维修开始时间"
                                   return-type="string" v-model="ruleForm.expectStartTime"/>
              <text v-else> {{ ruleForm.expectStartTime || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="预计维修结束时间:" name="expectEndTime" :required="boole">
              <text class="expectEndTime"/>
              <uni-datetime-picker v-if="boole" type="date" placeholder="请选择预计维修结束时间"
                                   :start="handleEffectDate(ruleForm.expectStartTime)"
                                   return-type="string" v-model="ruleForm.expectEndTime"/>
              <text v-else> {{ ruleForm.expectEndTime || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="交强险保单号:" name="compulsoryPolicyNum" :required="boole">
              <text class="compulsoryPolicyNum"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.compulsoryPolicyNum" placeholder="请输入交强险保单号"/>
              <text v-else> {{ ruleForm.compulsoryPolicyNum || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="商业险保单号:" name="commercialPolicyNum" :required="boole">
              <text class="commercialPolicyNum"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.commercialPolicyNum" placeholder="请输入商业险保单号"/>
              <text v-else> {{ ruleForm.commercialPolicyNum || '-' }}</text>
            </uni-forms-item>

            <uni-forms-item label="报案号:" name="reportingCaseNum" :required="boole">
              <text class="reportingCaseNum"/>
              <uni-easyinput v-if="boole" v-model="ruleForm.reportingCaseNum" placeholder="请输入报案号"/>
              <text v-else> {{ ruleForm.reportingCaseNum || '-' }}</text>
            </uni-forms-item>

          </view>


        </uni-forms>
      </view>
    </view>
  </view>
</template>

<script>

export default {
  name: "repairInfo", //维修信息
  dicts: ["responsibility_type","accident_type"],

  props: {
    value: {
      type: Object,
      default: {},
    },
    boole: {
      type: Boolean,
      default: true,
    },
    options:{
      type: Array,
      default: [],
    }
  },
  computed: {
    ruleForm: {
      get() {
        let that = this;
        const proxy = new Proxy(that.value, {
          get(target, key) {
            return Reflect.get(target, key);
          },
          set(target, key, value) {
            that.$emit("input", {...target, [key]: value});
            return true;
          },
        });
        return proxy;
      },
    },
    handleLabel() {
      return function (arr, type) {
        let name = "";
        arr.map((v) => {
          if (type == v.value) {
            name = v.label;
          }
        });
        return name;
      };
    },
    handleValue(){
      return function (val){
        switch (val) {
          case '1':
            return '报废';
          case '2':
            return '一般维修';
          case '3':
            return '出险';
          default:
            return '-';
        }
      }
    },
  },
  watch: {
    'value.lossAssessmentUrl': {
      handler(val) {
        if (val) {
          this.$refs.ruleForm.clearValidate(['lossAssessmentUrl'])
        }
      },
      deep: true,
    }
  },
  data() {
    return {
      maintenance: [
        {value: "1", text: "报废"},
        {value: "2", text: "一般维修"},
        {value: "3", text: "出险"},
      ],
      settlement: [
        {value: "1", text: "实物赔付申请"},
        {value: "2", text: "理赔款支付申请"},
      ],
      range: [
        {value: "1", text: "是"},
        {value: "2", text: "否"},
      ],
      rules: {
        maintenanceType: {
          rules: [
            {
              required: true,
              errorMessage: "维修类别",
              validateTrigger: "bind",
            },
          ],
        },
        settlementType: {
          rules: [
            {
              required: true,
              errorMessage: "理赔类别",
              validateTrigger: "bind",
            },
          ],
        },
        expectStartTime: {
          rules: [
            {
              required: true,
              errorMessage: "请选择预计维修开始时间",
              validateTrigger: "bind",
            },
          ],
        },
        expectEndTime: {
          rules: [
            {
              required: true,
              errorMessage: "请选择预计维修结束时间",
              validateTrigger: "bind",
            },
          ],
        },

        //保险类型 报废
        insuredName: {
          rules: [
            {
              required: true,
              errorMessage: "请输入被保险人",
              validateTrigger: "blur",
            },
          ],
        },
        driverName: {
          rules: [
            {
              required: true,
              errorMessage: "请输入驾驶员",
              validateTrigger: "blur",
            },
          ],
        },
        responsibleUnitName: {
          rules: [
            {
              required: true,
              errorMessage: "请输入责任人单位名称",
              validateTrigger: "blur",
            },
          ]
        },
        responsibilityType: {
          rules: [
            {
              required: true,
              errorMessage: '请选择责任类型',
              validateTrigger: "bind",
            }
          ]
        },
        responsibleInsuranceUnitName: {
          rules: [
            {
              required: true,
              errorMessage: "请输入责任方保险公司名称",
              validateTrigger: "blur",
            },
          ]
        },
        accidentDate: {
          rules: [
            {
              required: true,
              errorMessage: '请选择事故日期',
              validateTrigger: "bind",
            }
          ]
        },
        accidentType: {
          rules: [
            {
              required: true,
              errorMessage: '请选择事故类型',
              validateTrigger: "bind",
            }
          ]
        },
        accidentLocation: {
          rules: [
            {
              required: true,
              errorMessage: '请输入出险地点',
              validateTrigger: "blur",
            }
          ]
        },
        humanInjury: {
          rules: [
            {
              required: true,
              errorMessage: '请选择是否有人伤',
              validateTrigger: "bind",
            }
          ]
        },
        reportingCaseTime: {
          rules: [
            {
              required: true,
              errorMessage: '请选择报案时间',
              validateTrigger: "bind",
            }
          ]
        },
        lossAssessmentUrl: {
          rules: [
            {
              required: true,
              errorMessage: '上传定损单',
              validateTrigger: "blur",
            }
          ]
        },

        //维修类型 一般维修
        maintenanceShopId: {
          rules: [
            {
              required: true,
              errorMessage: "签约维修厂/维修厂",
              validateTrigger: "bind",
            },
          ],
        },
        faultPhenomenon: {
          rules: [
            {
              required: true,
              errorMessage: "请输入故障现象",
              validateTrigger: "blur",
            },
          ],
        },
        maintenanceFaultDiagnosis: {
          rules: [
            {
              required: true,
              errorMessage: "请输入维修厂故障诊断",
              validateTrigger: "blur",
            },
          ]
        },
        maintenanceQuoter: {
          rules: [
            {
              required: true,
              errorMessage: '请输入维修厂报价',
              validateTrigger: "bind",
            }
          ]
        },
        reasonForClaim: {
          rules: [
            {
              required: true,
              errorMessage: "请选择是否符合索赔理由",
              validateTrigger: "bind",
            },
          ]
        },
        comprehensiveRecommendations: {
          rules: [
            {
              required: true,
              errorMessage: '请输入综合建议方案',
              validateTrigger: "blur",
            }
          ]
        },

        //保险类型 出险
        accidentTime:{
          rules: [
            {
              required: true,
              errorMessage: '请选择出险日期',
              validateTrigger: "blur",
            }
          ]
        },
        compulsoryPolicyNum:{
          rules: [
            {
              required: true,
              errorMessage: '请输入交强险保单号',
              validateTrigger: "blur",
            }
          ]
        },
        commercialPolicyNum:{
          rules: [
            {
              required: true,
              errorMessage: '请输入商业险保单号',
              validateTrigger: "blur",
            }
          ]
        },
        reportingCaseNum:{
          rules: [
            {
              required: true,
              errorMessage: '请输入报案号',
              validateTrigger: "blur",
            }
          ]
        },
      },

    };
  },
  created() {
  },
  mounted() {

  },
  methods: {
    handleMaintenanceShopId(val){
      if(val){
        this.value.maintenanceShopId = this.ruleForm.maintenanceShopId = val.supplierId
        this.value.maintenanceShop = this.ruleForm.maintenanceShop = val.supplierName
      }
    },

    handleEffectDate(val){
      let date = new Date(val)
      return date.setDate(date.getDate() + 1);
    },

    blurAmount(str) {
      if (this.ruleForm[str]) {
        let msg = /^(?:[1-9]\d*|0)(?:\.\d+)?$/;
        if (!msg.test(this.ruleForm[str])) {
          this.ruleForm[str] = "";
        } else {
          this.ruleForm[str] = this.ruleForm[str]
              .toString()
              .match(/^\d+(?:\.\d{0,2})?/)[0];
        }
      }
    },

    //定损总计
    sumPrice() {
      let num = 0;
      if (this.ruleForm.maintenanceType === "1") {
        num =
            Number(this.ruleForm.vehicleAssessmentPrice) +
            Number(this.ruleForm.residualValue) +
            Number(this.ruleForm.carOther);
      }
      if (this.ruleForm.maintenanceType === "3") {
        num =
            Number(this.ruleForm.vehicleAssessmentPrice) +
            Number(this.ruleForm.persionAssessmentPrice) +
            Number(this.ruleForm.otherAssessmentPrice);
      }

      this.ruleForm.assessmentTotalPrice = num
          .toString()
          .match(/^\d+(?:\.\d{0,2})?/)[0];
    },


    handleEffect() {
      return new Promise((resolve, reject) => {
        this.$refs.ruleForm
            .validate()
            .then((res) => {
              resolve();
            })
            .catch((err) => {
              let key = ".flex-col" + ">>>" + "." + err[0].key;
              reject(key);
            });
      });
    },
  },
};
</script>

<style scoped lang=""></style>


